/**
 * @description webpack dev config
 */

const webpack = require('webpack')
const { merge } = require('webpack-merge')
const MiniCssExtractPlugin = require('mini-css-extract-plugin')
const TerserJSPlugin = require('terser-webpack-plugin')
const CssMinimizerPlugin = require('css-minimizer-webpack-plugin')
const { CleanWebpackPlugin } = require('clean-webpack-plugin')
const webpackCommonConf = require('./webpack.common')

module.exports = merge(webpackCommonConf, {
  mode: 'production',
  output: {
    filename: 'main.[contenthash:8].js' // 打包代码时，加上内容hash；文件内容变化之后，才会改变文件；利用http缓存
  },
  plugins: [
    new webpack.DefinePlugin({
      ENV: JSON.stringify(process.env.NODE_ENV)
    }),
    // 分离 css 文件; css 文件加 hash
    new MiniCssExtractPlugin({
      filename: 'style.[contenthash:8].css'
    }),
    new CleanWebpackPlugin()
  ],
  optimization: {
    // 压缩 js css
    minimizer: [new TerserJSPlugin({}), new CssMinimizerPlugin({})]
  }
})
